<!DOCTYPE html>
<html lang="en">
<head>


    <style type="text/css">
        .top{
           width:820px;
           height:60px;
           margin:auto;
           backgroud:red;
           color:blue;
           margin-top:30px;
           margin-buttom:-20px;
           font-size:30px;
           margin-left:400px;
        }
    </style>
    <meta charset="UTF-8">
    <title>数据查看</title>
    <script type="text/javascript"  src="./js/layui-v2.2.3/layui/jquery.min.js">
    <script type="text/javascript"  src="./js/layui-v2.2.3/layui/layui.all.js"></script>
    <link rel="stylesheet"  href="./js/layui-v2.2.3/layui/css/layui.css"/>


   <!-- <script type="text/javascript"  src="./js/layui-v2.2.3/layui/jquery.min.js">-->

</head>
<body>
   <div class="top">数据查看系统</div>
<div class="layui-tab">
    <ul class="layui-tab-title">
        <li class="layui-this">根据文件名查找</li>

    </ul>
    <div class="layui-tab-content">
        <div class="layui-tab-item layui-show">

                <div class="layui-form-item">
                    <label class="layui-form-label">输入框</label>
                    <div class="layui-input-block">
                        <input type="text" name="title" required  lay-verify="required" placeholder="请输入文件路径和文件名" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button  class="layui-btn  submit" lay-submit lay-filter="formDemo"  >立即提交</button>

                    </div>
                </div>



        </div>


    <div id="div" style="width:700px;height:200px;margin-left:400px;">

    </div>

    </div>
</div>


</body>

<script>

  $(".submit").click(function(){
  var inputtext=$(".layui-input").val();


    $.ajax({
                     url : "http://localhost:8080/bw/index", // 请求地址
                     error:function(data){   // 请求失败回调
                        //alert(data.responseText)
                       console.log(data.responseText);

                       $("#div").html(data.responseText)
                     },
                     success:function(data){ // 请求成功回调
                        $("#div").html(data.responseText)
                     },
                     type:"GET",             // 请求的方式
                     dataType:"json",
                      data:{                   // 请求的参数
                         path:inputtext
                     }

                  });

  })
</script>

</html>